<!DOCTYPE html>
<html lang="zh" xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta th:replace="clip/meta::common">
    <meta th:replace="theme/sakura/clip/meta::article(${post.title},${post.metaDescription},${post.metaKeywords})">
    <link th:replace="theme/sakura/clip/css-index::article"/>
</head>

<body class="hfeed chinese-font serif">
<section id="main-container">
    <div th:replace="theme/sakura/clip/head::article(${post.title},
        ${author.avatar},
        ${author.username})"></div>
    <div id="page" class="site wrapper">
<!--背景-->
        <div th:replace="theme/sakura/clip/head::article-bg(${post.title},${post.thumbnail},
        ${author.avatar},
        ${author.username},'userUrl',${post.createTime})"></div>
        <div id="content" class="site-content">
            <div id="primary" class="content-area">
<!--                内容-->
                <main id="main" class="site-main" role="main">
                    <article th:replace="theme/sakura/clip/widget::article-content(${post.url},${post.content},${post.title})"></article>
                    <section
                            th:replace="theme/sakura/clip/widget::next-article(${post.thumbnail},'url','title')"></section>
                    <section th:replace="theme/sakura/clip/widget::author-profile(${author.avatar},${author.username},'url')"></section>
                </main><!-- #main -->
            </div><!-- #primary -->
        </div><!-- #content -->
        <section id="comments" class="comments">
            <div class="comments-main">
                <h3 id="comments-list-title">
                    <span class="name i18n" data-iname="comment.name"></span>
                    <span class="noticom i18n" data-iname="comment.number" data-ivalue="0"></span>
                </h3>
                <halo-comment th:id='${post.id}' type='post' configs='{
			"autoLoad": true,
			"showUserAgent": true,
			"gravatarSource": "//cn.gravatar.com/avatar",
			"loadingStyle": "default",
			"aWord": "留下你的神评论",
			"authorPopup": "输入QQ号将自动拉取昵称和头像",
			"emailPopup": "你将收到回复通知",
			"urlPopup": "禁止小广告😀"
		}'/>
            </div>
        </section>
        <!-- 定义可变属性，会根据页面的改变而变化 -->
        <script type='text/javascript'>
            /* <![CDATA[ */
            var PageAttr = {
                "metas": {},
            }
            /* ]]> */
        </script>
    </div><!-- #page Pjax container-->

</section><!-- #section -->
<!-- m-nav-center -->
<a href="#" class="cd-top"></a>
<!-- m-cd-top start -->
<button class="m-cd-top" title="Go to top">
    <i class="fa fa-chevron-up" aria-hidden="true"></i>
</button>
<!-- m-cd-top end -->
<!-- search start -->
<form class="js-search search-form search-form--modal" method="get" action="/search" role="search">
    <img th:src="@{/theme/img/search.gif}">
    <div class="search-form__inner">
        <div>
            <p class="micro mb-">输入后按回车搜索 ...</p>
            <i class="iconfont icon-search"></i>
            <input class="text-input" type="search" name="keyword" placeholder="Search" required>
        </div>
    </div>
    <div class="search_close"></div>
</form>
<!-- search end -->
<div th:replace="theme/sakura/clip/widget::theme-change"></div>
<script th:replace="theme/sakura/clip/config::article"></script>
<script th:replace="theme/sakura/clip/js-index::article"></script>
<div class="site-statistics">
</div>
</body>

</html>